<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <title>基础功能</title>
    <link rel="stylesheet" href="layui/css/layui.css">
    <link rel="stylesheet" href="css/basic-function.css">
</head>
<body class="basic-function">
<div class="basic-function-body">
    <!--start header-->
    <div class="header">
        <div class="layui-col-md2">操作说明<span class=""><img src="img/xiaojiantou.png" alt=""></span></div>
    </div>
    <!--end header-->

    <!--start ev-app-login-->
    <div class="ev-app-login">
        <div class="ev-app-login-body">
            <h1>每日APP登录</h1>
            <table class="layui-table">
                <colgroup>
                    <col width="195">
                    <col width="140">
                    <col width="260">
                    <col width="198">
                    <col width="178">
                </colgroup>
                <tbody>
                <tr>
                    <td>类型</td>
                    <td>积分周期</td>
                    <td>周期内积分次数上限（次）</td>
                    <td>积分分值（分）</td>
                    <td>操作</td>
                </tr>
                <tr>
                    <td class="ttd">无</td>
                    <td class="ttd">每天</td>
                    <td class="ttd">1</td>
                    <td class="ttd">5</td>
                    <td class="basic-function-img"></td>
                </tr>
                </tbody>
            </table>
        </div>
    </div>
    <!--end ev-app-login-->

    <!--start set-photo-->
    <div class="set-photo">
        <div class="set-photo-body">
            <h1>设置头像</h1>
            <table class="layui-table">
                <colgroup>
                    <col width="195">
                    <col width="140">
                    <col width="260">
                    <col width="198">
                    <col width="178">
                </colgroup>
                <tbody>
                <tr>
                    <td>类型</td>
                    <td>积分周期</td>
                    <td>周期内积分次数上限（次）</td>
                    <td>积分分值（分）</td>
                    <td>操作</td>
                </tr>
                <tr>
                    <td class="ttd">无</td>
                    <td class="ttd">仅一次</td>
                    <td class="ttd">1</td>
                    <td class="ttd">20</td>
                    <td class="basic-function-img"></td>
                </tr>
                </tbody>
            </table>
        </div>
    </div>
    <!--end set-photo-->

    <!--start set-introduction-->
    <div class="set-introduction">
        <div class="set-photo-body">
            <h1>设置简介</h1>
            <table class="layui-table">
                <colgroup>
                    <col width="195">
                    <col width="140">
                    <col width="260">
                    <col width="198">
                    <col width="178">
                </colgroup>
                <tbody>
                <tr>
                    <td>类型</td>
                    <td>积分周期</td>
                    <td>周期内积分次数上限（次）</td>
                    <td>积分分值（分）</td>
                    <td>操作</td>
                </tr>
                <tr>
                    <td class="ttd">无</td>
                    <td class="ttd">仅一次</td>
                    <td class="ttd">1</td>
                    <td class="ttd">20</td>
                    <td class="basic-function-img" lay-even="edit"></td>
                </tr>
                </tbody>
            </table>
        </div>
    </div>
    <!--end set-introduction-->
</div>
<script src="layui/layui.js"></script>
<script src="layui/lay/modules/jquery.js"></script>
<script>

    layui.use(['layer', 'form', 'element'], function () {
        var $ = layui.$;
        $(".basic-function-img").click(function () {
            $(this).siblings().each(function () {

                obj_text = $(this).find("input:text");    // 判断单元格下是否有文本框
                console.log(obj_text);
                if (!obj_text.length) {   // 如果没有文本框，则添加文本框使之可以编辑
                    var inp = $(this).html("<input type='text' value='" + $(this).text() + "'>");
                }
                else {  // 如果已经存在文本框，则将其显示为文本框修改的值
                    var inp1 = $(this).html(obj_text.val());
                }
                function tdInput(){
                    var k = 0;
                    for(k; k < 12; k++){
                        $('.ttd').eq(k).html($('.ttd').eq(k).children().val());
                    }
                }
                $('input').keydown(function (event) {
                    var keycode = event.which;
                    if (keycode == 13) {
                        tdInput()
                    }
                });
            });
        });
    });
</script>
</body>
</html>